<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>快递列表 -- 快递e栈服务平台</title>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
<style type="text/css">
	body{
		margin: 0;
		padding: 0;
		background-color: #eeeeee;
		font-family: "楷体",serif;
	}
	.item{
		margin: 20px;
		margin-bottom: 50px;
	}
	.item_top{
		text-align: center;
	}
	.item_top>span{
		font-size:14px;
		display: inline-block;
		padding: 5px 12px;
		background-color: #ddd;
		color:#fff;
		border-radius: 5px;
	}
	.item_content{
		background-color: #fff;
		padding: 25px 15px;
		margin-top: 6px;
	}
	.item_content_top_1{
		font-size: 24px;
		font-weight: bold;
	}
	.item_content_top_2{
		color:#eee;
		font-size: 14px;
		margin: 5px 0px;
	}
	.item_content_top_3{
		margin: 10px 0px;
	}
	.item_content_top_4{
		margin: 10px 0px;
	}
	.item_content_bottom>a{
		text-decoration: none;
		color:#33e;
	}
</style>
</head>
<body>
	<div id="contentNull" style="text-align:center;display: none;"></div>
	<div class="content" id="unpicked"></div>
	<div class="content" id="picked"></div>
</body>
<script src="./js/jquery-2.1.4.min.js"></script>
<script src="./js/layer/layer.js"></script>
<script>
	$(function () {
		var windowID = layer.load(2);
		$.getJSON("/wechat/findExpressesByPhone.do",null,function(values){
			layer.close(windowID);
			if (values.status===0){
				// values: {"status":0,"data":{"unpicked":[{"id":177,"ex_num":"12312652","username":"小张","userphone":"13897845154","company":"安能快递","code":"998217","intime":"2021-03-10 09:03:19","outtime":"未出库","status":"待取件","staffphone":"16667778888"}],"picked":[]}
				var exsUnpicked = values.data.unpicked;
				for (var i=0;i<exsUnpicked.length;i++){
					var ex = exsUnpicked[i];
					let item = '<div class="item">' +
							'<div class="item_top"><span>' + ex.intime + '</span></div>' +
							'<div class="item_content">' +
							'<div class="item_content_top">' +
							'<div class="item_content_top_1">取件通知</div>' +
							'<div class="item_content_top_2">' + ex.intime + '</div>' +
							'<div class="item_content_top_3">您有一个包裹到e栈了!</div>' +
							'<div class="item_content_top_4">' +
							'取件码:<span style="color:#0055aa">' + ex.code + '</span><br>' +
							'快递公司:' + ex.company + '<br>' +
							'运单号码:' + ex.ex_num + '<br>' +
							'站点电话:' + ex.staffphone + '<br>' +
							'</div>' + '</div>' +
							'<hr>' +
							'<div class="item_content_bottom">' +
							'<a href="/wechat/generateQRCodeContent.do?type=express&code=' + ex.code + '">二维码</a>' +
							'</div>' + '</div>' + '</div>';
					$("#unpicked").append(item);
				}
				var exsPicked = values.data.picked;
				for (var i=0;i<exsPicked.length;i++){
					var ex = exsPicked[i];
					let item = '<div class="item">' +
							'<div class="item_top"><span>' + ex.outtime + '</span></div>' +
							'<div class="item_content">' +
							'<div class="item_content_top">' +
							'<div class="item_content_top_1">取件成功通知</div>' +
							'<div class="item_content_top_2">' + ex.outtime + '</div>' +
							'<div class="item_content_top_3">您有一个包裹从e栈取出了!</div>' +
							'<div class="item_content_top_4">' +
							'快递公司:' + ex.company + '<br>' +
							'运单号码:' + ex.ex_num + '<br>' +
							'站点电话:' + ex.staffphone + '<br>' +
							'</div>' + '</div>' +
							'<hr>' +
							'<div class="item_content_bottom">' +
							'<a href="#">有疑问 ? 点了也没用</a>' +
							'</div>' + '</div>' + '</div>';
					$("#picked").append(item);
				}
			} else if (values.status===-1) {
				// 用户没有任何快递
				let htmlContent = '<div><h3>未找到任何快递信息!</h3></div>'+
						'<a href="index.html"><h4>转至主页</h4></a>';
				$("#contentNull").append(htmlContent).show();
			} else if (values.status===-2) {
				// 用户未登录，Session中找不到手机号 (在filter的作用下可能不需要触发该代码块的代码)
				layer.msg("未登录，请先登录！");
				window.location.href = "login.html";
			} else {
				// 不存在的status值，未知的错误 (不太可能发生，但if else if else闭合原则最好遵守)
				window.location.href = "500.html";
			}
		});
	});
</script>
</html>